<template>

	<view>
		<bg-video></bg-video>
		<cu-custom bgColor="bg-pink" :isBack="true">
			<block class="text-white" slot="content">预约记录</block>
		</cu-custom>
		<view>
			<view class="">
				<view v-for="(yyjl,index) in aroomyyjls" :key="index">
					<view  class="cu-card dynamic">
						<view class="cu-item shadow">
							<view class="bg-pink text-white text-sm flex justify-between align-center padding">
								<view>{{yyjl.rmorderid}}</view>
								<view>
									<text v-if="yyjl.jlid == currentJl.jlid"
										class="cu-tag bg-pink light round"
										@tap="toYyjlEdit(yyjl.rmorderid)">查看</text>
								</view>
							</view>
							<view class="text-gray text-sm flex justify-between padding">
								<view v-if="yyjl.tflg != 'C'">
									<text class="bg-green padding-xs round" v-if="yyjl.pflg">已支付</text>
									<text class="bg-red padding-xs round" v-else="yyjl.pflg">未支付</text>
								</view>
								<view>
									<text v-if="yyjl.tflg == 'P'">未开始</text>
									<text v-else-if="yyjl.tflg == 'S'">已开始</text>
									<text v-else-if="yyjl.tflg == 'F'">已结束</text>
									<text v-else-if="yyjl.tflg == 'R'">提款中</text>
									<text v-else-if="yyjl.tflg == 'T'">已提款</text>
									<text class="cu-tag bg-red round" v-else-if="yyjl.tflg == 'C'">已取消</text>
									<text v-else-if="yyjl.tflg == 'J'">退款中</text>
									<text v-else-if="yyjl.tflg == 'E'">已退款</text>
								</view>
							</view>
							<view  class="text-gray text-sm flex justify-between padding">
								<view class="text-gray text-sm flex justify-between">
									{{yyjl.ct}}
								</view>
								<view v-if="yyjl.tflg != 'C'" class="flex justify-between">
									<text class="text-red">实付【{{yyjl.sfje / 100}}】+</text>
									<text class="text-red">余额付【{{yyjl.yezfje / 100}}】=</text>
									<text class="text-red">￥{{yyjl.amont / 100}}</text>
								</view>
							</view>
							<view v-if="yyjl.tflg != 'C'" class="padding-top padding-bottom-sm text-orange">
								<view @tap="toStoreDetail(yyjl.storeid)" 
									class="flex justify-end align-baseline padding-left padding-right">
									<text class="text-xxl">
										<text class="iconfont icon-tiyuguan"></text>
									</text>
									<text class="text-sm">
										<text>{{yyjl.sname}}</text>
										<text class="cuIcon-right"></text>
									</text>
								</view>
								<view @tap="toRoom(yyjl.roomid)"
									class="flex justify-end align-baseline padding-left padding-right">
									<text class="text-xxl">
										<text class="iconfont icon-fangjian"></text>
									</text>
									<text class="text-sm">
										<text>{{yyjl.rname}}</text>
										<text class="cuIcon-right"></text>
									</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-if="aroomyyjls.length < pageInfo.total" class="padding ">
				<button @click="loadMore" class="cu-btn block bg-pink lg">显示更多</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data: function() {
			return {
				pageInfo: {
					current: 1,
					size: 16,
					total: 0,
					jlid: this.store.state.jl.jlid,
					storeid: "",
					roomid: "",
					key: "",
				},
				aroomyyjls: []
			};
		},
		computed: {
			currentJl: function() {
				return this.store.state.jl;
			}
		},
		onLoad: function(option) {
			if (option.jlid) {
				this.pageInfo.jlid = option.jlid;
			}
			if (option.storeid) {
				this.pageInfo.storeid = option.storeid;
			}
			if (option.roomid) {
				this.pageInfo.roomid = option.roomid;
			}
			console.log(this.pageInfo.storeid != '');
			this.search();
		},
		methods: {
			search: function() {
				this.aroomyyjls = [];
				this.pageInfo.current = 1;
				this.loadYyjls();
			},
			loadMore: function() {
				this.pageInfo.current++;
				this.loadYyjls();
			},
			loadYyjls: function() {
				this.api("/yy/page").send(this.pageInfo).then(data => {
					this.pageInfo.current = data.aroomyyjls.current;
					this.pageInfo.total = data.aroomyyjls.total;
					this.pageInfo.size = data.aroomyyjls.size;
					for (let index in data.aroomyyjls.records) {
						let record = data.aroomyyjls.records[index];
						this.aroomyyjls.push(record);
					}
				});

			},

			toYyjlEdit: function(yyjlid) {
				uni.navigateTo({
					url: "/pages/cjl/yy/edit?rmorderid=" + yyjlid
				});
			},
			toStoreDetail: function(storeid) {
				uni.navigateTo({
					url: "/pages/cjl/md/mdxx?storeid=" + storeid
				});
			},
			toRoom: function(roomid) {
				uni.navigateTo({
					url: "/pages/cjl/fj/detail?roomid=" + roomid
				});
			},
		}
	}
</script>

<style>
</style>